import { Button, Popconfirm, Space, Table, Tag } from "antd";
import ButtonCheck from "@/components/ButtonCheck";
import { useEffect, useState } from "react";
import { getBannerList } from "@/api/banner";
import { ColumnsType } from "antd/lib/table";

import styles from "./index.module.css";
console.log("styles", styles);

const columns: ColumnsType<never> = [
  {
    title: "序号",
    render: (column, row, index: number) => {
      return index + 1;
    },
  },
  {
    title: "图片",
    render: (column, row: any) => {
      return <img style={{ height: "100px" }} src={row.img} alt="" />;
    },
  },
  {
    title: "操作",
  },
];

function PageBanner() {
  const [dataSource, setDataSource] = useState([]);
  function fetchData() {
    getBannerList().then((response) => {
      console.log(response);
      setDataSource(response.data);
    });
  }

  useEffect(() => {
    fetchData();
  }, []);

  return (
    <div>
      <div className="page-header">
        <div className="handle">
          <Button className={styles["ant-btn"]}>新增</Button>
        </div>
      </div>
      <Table
        rowSelection={{}}
        dataSource={dataSource}
        columns={columns}
        rowKey="bannerid"
      />
      ;
    </div>
  );
}

export default PageBanner;
